:root {
}

.t-quick-filter {
  .FilterItem-Desktop {
    column-gap: 8px;
    row-gap: 8px;

    .t-quick-filter_chip-group-label {
      .t-quick-filter-help{
        margin-left: 4px;
      }
    }

    .FilterItem {
      row-gap: 8px;

      .item-count{
        margin-left: 3px;

        &::after{
          display: none;
          content: ")";
        }

        &::before{
          display: none;
          content: "(";
        }
      }
    }

    .FilterItem.SelectHelper{
      .SelectHelper-container{
        padding-right: 8px;
        min-width: 50px;

        .t-quick-filter-select-helper{
          &--fix-width{
            input.select_helper_input_inner{
              width: 10px !important;
            }
          }

          &.tr-input-default.select_helper_input{
            background-color: unset;

            &.tr-input-form > label{
              border-bottom-width: 0px;
            }

            & > label{
              min-height: unset;

              & > div.q-field__inner{
                & > div.q-field__control{
                  background-color: unset !important;
                }
              }

              div.q-field__prepend.no-wrap.items-center > span{
                flex-wrap: unset !important;
              }
            }

            /**
            * 会影响下拉框的宽度
            input.select_helper_input_inner{
              width: 10px !important;
            }
            */
          }
        }
      }
    }

    .divider {
      border-left: rgba(0, 0, 0, 0.32) solid 1px;
      display: inline-block;
      height: 16px;
      margin-left: 8px;
      margin-right: 8px;
    }

    .select-tabindex .q-field--highlighted {
      .q-field__control {
        box-shadow: none;
      }
      .q-field__control:before {
        border: 1px solid var(--t-color);
        box-shadow: 0 0 3px rgba(var(--t-color-rgb), 0.6);
      }
    }
  }

  .q-field__append{
    padding-left: 4px !important;
  }

  &.t-tag-mode-mobile {

    .FilterItem-Desktop {
      font-size: 12px;
      column-gap: 0;
      overflow-y: auto;
      flex-wrap: nowrap;
      scrollbar-width: none; /* 对于Firefox */
      height: 32px;

      &::-webkit-scrollbar {
        display: none;
      }

      .FilterItem {
        height: 25px;
        flex-wrap: nowrap;


        .t-chip{
          border-radius: 100px;
          height: 25px !important;
          background-color: #EDEFF3;
          margin-right:12px;
        }

        .t-chip .q-chip__content{
          font-size: 12px;

        }
        .t-chip.tr-chip-select-type-moon{
          line-height: 25px;
        }
      }

      // .divider {
      //   /* display:none; */
      //   /*  border-left: 0px; */

      //   &::after {
      //     content: ';';
      //     position: relative;
      //     top: -5px;
      //   }
      // }
      .q-field__inner,
      .q-field__inner {
        height: 32px;
      }
      .tr-select-big {
        background-color: transparent;

        margin-right: 0px !important;

        .q-field__native {
          flex-direction: column;
          margin-right: 10px;
        }
      }
      .q-field__control {
        height: 24px;
        padding-left: 8px !important;
        background-color: transparent;
      }
      .t-quick-filter_chip-group-label {
        line-height: 12px;
        line-height: 24px;
        display: inline-flex;
        flex-wrap: nowrap;
        text-wrap: nowrap;
        white-space: nowrap;
        align-items: center;

        // .t-quick-filter-help{
        //   margin-left: 4px;
        // }
      }
      .q-field__append {
        height: 24px;
        padding-right: 8px;
        display: none;

        .q-icon {
          transform: rotate(0deg);
        }
      }
    }
  }

  .t-quick-filter_loading {
    position: absolute;
    inset: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0.35;
    background-color: aliceblue;
  }

  &.for-saas{
    .FilterItem-Desktop{
      column-gap: 30px;
      row-gap: 16px;
      .FilterItem {
        row-gap: 16px;
        .divider{
          display: none;
        }
      }
    }

    .t-quick-filter_chip-group-label{
      margin-right: 8px;

      .help-link{
        margin-right: 8px;
      }
    }
    .q-chip{
      height: auto !important;
      background-color: #edeff3;
      font-size: 14px;
      color: rgba(0, 0, 0, var(--t-color-opacity, /*批量处理透明度,将80%替换为--t-color-opacity*/0.8));
      margin-right: 10px;
      border-radius: 4px;
    }

  }
}

.mobile {
  .t-quick-filter {
    .FilterItem-Desktop {
      .FilterItem.SelectHelper{
        .SelectHelper-container{
          .t-quick-filter-select-helper.tr-input-default.select_helper_input{
            input.select_helper_input_inner{
              width: 10px !important;
            }
          }
        }
      }
    }
  }
}
.quick-filter_searchbar {
  .t-input {
    min-height: 40px;

    .q-field__inner {
      display: flex;
      align-items: center;

      .q-field__control {
        flex: 1;
        height: 32px;
        margin-top: 4px;
        margin-bottom: 4px;
        border-radius: 4px;

        .q-field__prepend {
          height: auto !important;
        }

        .q-field__append {
          height: auto !important;
          margin-right: 12px;
        }
      }
    }
  }
}
